<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Vue 测试实例</title>
    <!--引入vue.js-->
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
    <style>

    </style>
</head>
<body>

<div id="app">

    <p>{{ msg }}</p>

    <!--v-bind只能实现 model(data) 到 view(input)的绑定，单向绑定-->
    <input type="text" v-bind:value="msg"/>

    <!--v-model可以实现双向绑定，但是只能用于form组件，当内容变化，更新data -->
    <input type="text" v-model="msg" />
</div>

<script>
    //
    var vm = new Vue({
        el: '#app',
        data: {
            msg: 'hello'
        },
        methods: {}
    })
</script>
</body>
</html>
